<template>
	<view >
		<view class="myinformation">
			<image :src="UserPhoto" mode="aspectFill"></image>
			<view class="name">
				<text class="username">用户名：{{name}}</text>

			</view>
		</view>

		<view>

			<view class="userinfo">
				<view class="item" @click="change_info">
					<text style="margin-top: 6px;">修改账号信息</text>
					<view class="text_line"></view>
				</view>
			</view>
			<view class="userinfo">
				<view class="item" @click="toggleForm">
					<text style="margin-top: 6px;">优惠券</text>
					<view class="text_line"></view>
				</view>
			</view>
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				name: '张三',
				showForm: false,
				formData: {
					username: '',
					phone: '',
				},
				UserToken:{
					"token":'',
				},
				UserPhoto:'',
			}
		},
		onLoad:function(){
			this.UserToken.token=uni.getStorageSync('login-user').token;
			let new_url;
			if(uni.getStorageSync('login-role')==1)
			new_url='http://192.168.2.226:8086/business/user/getinfo';
			else
			new_url='http://192.168.2.226:8086/business/seller/getinfo';
			this.get_user_info(new_url);
			
		},
		
		methods: {
			change_pas(){
				this.$router.push('/pages/register/Register')
			},
			
			change_info(){
				this.$router.push('/pages/setting/My_info')
			},
			
			get_user_info(new_url){
				uni.request({
				 	url:new_url,
				 	method:'GET',
					header: {
					        'token': this.UserToken.token // 在这里设置请求头
					    },
					
				 	// 返回成功的结果
				 	success:(res) =>{
						this.name=res.data.data.username;
						let MyPhoto=res.data.data.photo;
						this.UserPhoto='http://192.168.2.226:8086/business/common2/download?name='+encodeURIComponent(MyPhoto) ;
					},
				 	fail:(error) => {
				 		console.log("获取失败")
				 	},
				 })
				
			}
		},
	}
</script>

<style>
	.model {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.out {
		position: absolute;
		bottom: 2rem;
		width: 50%;
	}

	.myinformation {
		display: flex;
		padding: 20px;
	}

	.myinformation .name {
		display: flex;
		/* 竖直排布 */
		flex-direction: column;
		/* 均匀分布 */
		justify-content: space-evenly;
	}

	.myinformation image {
		width: 100px;
		height: 100px;
		margin-right: 20px;
	}

	.username {
		font-size: 20px;
		font-weight: 900;
	}

	.realname .firstname {
		margin-right: 20px;

	}

	.realname .secondname {}

	.userinfo {
		background-color: srgba(85, 255, 0, 0.0);
		padding: 5px 0;
		
	}

	.userinfo .item {
		height: 40px;
		line-height: 60px;
		padding: 0 20px;
		display: flex;
		flex-direction: column;
	}

	.form-container {
		position: fixed;
		top: 0;
		right: -100%;
		width: 300px;
		height: 50%;
		background-color: #fff;
		transition: right 0.3s;
		z-index: 10;
		padding: 20px;
		box-sizing: border-box;
	}

	.is-visible {
		right: 0;
	}

	.uni-input-wrapper {
		margin-bottom: 20px;
		/* 调整按钮与输入框之间的距离 */
	}

	.uni-input-wrapper text {
		margin-top: 10px;
		color: black;
	}

	.uni-input {
		width: 100%;
		padding: 10px;
		border: 1px solid #ddd;
		border-radius: 4px;
	}

	.button-group {
		display: flex;
		justify-content: space-between;
		margin-top: 10px;
		/* 增加或减少此值以调整按钮组距输入框的距离 */

	}

	.submit-button,
	.cancel-button {
		padding: 10px 20px;
	}

	.content {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}

	.avatar-uploader {
		margin-bottom: 20px;
	}

	.avatar {
		width: 120px;
		height: 120px;
		background-color: #ddd;
		margin-bottom: 10px;
	}
	.text_line{
			  
			/*盒子下边距，这里用来指定下划线距离文字的高度*/
			padding-bottom: 1px;
			
			/*设定一个2px，实线*/
	  border-bottom: 2px solid rgba(245,245,245,1); 
	}
</style>